<template>
  <div class="yy-whp-parameter-record">
    <!--列表-->
    <div class="yy-parameter-record-list" v-show="type=='list'">
      <Card>
        <p slot="title">
          <Icon type="md-list" />
          台账记录列表
        </p>
        <Form ref="formInline" :model="formSearch"  inline>
          <FormItem prop="user">
            <Input type="text" v-model="formSearch.itemNum" placeholder="物品编号"></Input>
          </FormItem>
          <FormItem prop="user">
            <Input type="text" v-model="formSearch.itemName" placeholder="物品名称"></Input>
          </FormItem>
          <FormItem prop="user">
            <Select class="select" placeholder="请选择仓库" v-model="formSearch.storageNum" @on-change="changeStorage(formSearch.storageNum)">
              <Option value="">请选择</Option>
              <Option v-for="(dataSt,index) in dataStorage" :value="dataSt.storageNum" :key="index">{{dataSt.storageName}}</Option>
            </Select>
          </FormItem>
          <FormItem prop="user">
            <Select class="select" placeholder="请选择库区" v-model="formSearch.localNum">
              <Option value="">请选择</Option>
              <Option v-for="(dataLt,index) in dataLoctions" :value="dataLt.localNum" :key="index">{{dataLt.localName}}</Option>  
            </Select>
          </FormItem>
          <FormItem prop="user">
            <Select class="select" placeholder="请选择台账" v-model="formSearch.inoutType">
              <Option value="0">所有</Option>
              <Option value="1">入库</Option>
              <Option value="2">出库</Option>
            </Select>
          </FormItem>
          <FormItem prop="user">
            <DatePicker type="date" placeholder="起始时间" style="width: 200px" v-model="formSearch.st" :options="startTimeOption" @on-change="onStartTimeChange"></DatePicker>
          </FormItem>
          <FormItem prop="user">
            <DatePicker type="date" placeholder="结束时间" style="width: 200px" v-model="formSearch.et" :options="endTimeOption" @on-change="onEndTimeChange"></DatePicker>
          </FormItem>
          <FormItem>
            <Button type="primary" @click="handleSearch()">查询</Button>
          </FormItem>
        </Form>
        <div class="count">合计： 入库：373975.14    出库：457274.80</div>
        <Table :columns="columns" :data="data" ></Table>
        <div style="margin: 10px;overflow: hidden">
          <div style="float: right;">
            <Page :total="page.total" :page-size="page.pageSize" :current="1" @on-change="changePage" show-total></Page>
          </div>
        </div>
      </Card>
    </div>

    <!--打印材料入库清单 Bill of Materials-->
    <div class="yy-put-in-manage-details" v-show="type=='billMaterials'">
       <Card>
        <p slot="title">
          <Icon type="md-paper"/>
          台账记录关联清单
        </p>
        <p slot="extra">
          <Button type="primary" @click="handlePrint()" style="margin-right:10px">打印</Button>
          <Button type="primary" @click="goBack()">返回</Button>
        </p>
        <billMaterials :type=inOutType :dataType = generateTypeArr ref="child"></billMaterials>
      </Card>
    </div>

  </div>
</template>

<script>
import API from "./api";
import ValidatorRule from "@/filters/validator-rule";
import { formatNetTime } from "@/libs/tools";
import i18n from "./locale";
import dateMixin from "@/mixin/date-mixin";
import billMaterials from "../common/bill-materials/bill-materials";
import wareHouseMixin from "../common/warehouse-mixin";

export default {
  name: "yy-whp-parameter-record",
  mixins: [dateMixin, wareHouseMixin],
  components: {
    billMaterials
  },
  data() {
    return {
      i18n: i18n,
      currentData: "",
      detailsModal: false,
      inOutType: "",
      generateTypeArr: "",
      type: "list",
      page: {
        total: 0,
        pageSize: 20
      },
      formSearch: {
        st: "",
        et: "",
        itemNum: "",
        itemName: "",
        inoutType: "",
        userID: "",
        userName: "",
        b_UserRole: "",
        storageNum: "",
        localNum: "",
        hasNum: "",
        isShowAllSpareItem: ""
      },
      // editFormInLine: {
      //   itemNum: "",
      //   itemName: "",
      //   size: "",
      //   price: "",
      //   num: "",
      //   anount: "",
      //   storageName: "",
      //   localName: "",
      //   ivtType: "",
      //   orderNum: "",
      //   createTime: "",
      //   createUserName: ""
      // },
      // editFormRuleInline: {
      //   itemNum: ValidatorRule.require,
      //   itemName: ValidatorRule.require,
      //   size: ValidatorRule.require,
      //   price: ValidatorRule.require,
      //   num: ValidatorRule.require,
      //   anount: ValidatorRule.require,
      //   storageName: ValidatorRule.require,
      //   localName: ValidatorRule.require,
      //   ivtType: ValidatorRule.require,
      //   orderNum: ValidatorRule.require,
      //   createTime: ValidatorRule.require,
      //   createUserName: ValidatorRule.require
      // },
      columns: [
        {
          title: "物品编号",
          key: "itemNum"
        },
        {
          title: "物品名称",
          key: "itemName"
        },
        {
          title: "规格型号 ",
          key: "size"
        },
        {
          title: "单价 ",
          key: "price"
        },
        {
          title: "数量 ",
          key: "num"
        },
        {
          title: "金额 ",
          key: "amount"
        },
        {
          title: "仓库 ",
          key: "storageName"
        },
        {
          title: "库区",
          key: "localName"
        },
        {
          title: "台账类型",
          key: "ivtType"
        },
        {
          title: "关联单号",
          key: "orderNum",
          render: (h, params) => {
            const row = params.row;
            return h(
              "span",
              {
                class: {
                  "td-click": true
                },
                on: {
                  click: () => {
                    this.handleBillMaterials(params.index);
                  }
                }
              },
              row.orderNum
            );
          }
        },
        {
          title: "创建日期",
          key: "createTime"
        },
        {
          title: "操作人",
          key: "createUserName"
        }
      ],
      data: [],
      generateInTypeArr: [],
      generateOutTypeArr: []
    };
  },

  mounted() {
    this.handleSearch();
    this.initInType();
    this.initOutType();
  },

  computed: {},

  methods: {
    initInType() {
      let obj = {};
      this.getInTypeList(obj);
    },

    getInTypeList(obj) {
      API.getInTypeList(obj)
        .then(res => {
          if (res.code == 200) {
            let data = res.data;
            this.generateInTypeArr = data.list;
          }
        })
        .catch(err => {
          this.$Message.error("请求异常！");
        });
    },

    initOutType() {
      let obj = {};
      this.getOutTypeList(obj);
    },

    getOutTypeList(obj) {
      API.getOutTypeList(obj)
        .then(res => {
          if (res.code == 200) {
            let data = res.data;
            this.generateOutTypeArr = data.list;
          }
        })
        .catch(err => {
          this.$Message.error("请求异常！");
        });
    },

    handleSearch() {
      let obj = this.formSearch;
      obj.pageNum = 1;
      obj.pageSize = this.page.pageSize;
      this.formSearch = obj;
      this.getList(obj);
    },

    getList(obj) {
      API.getList(obj)
        .then(res => {
          if (res.code == 200) {
            let data = res.data;
            this.page.total = data.total;
            this.page.pageSize = data.pageSize;
            this.data = data.list;
          }
        })
        .catch(err => {
          this.$Message.error("请求异常！");
        });
    },

    changePage(pageNum) {
      let obj = this.formSearch,
        maxPageNum = Math.ceil(this.page.total / this.page.pageSize);
      if (obj.pageNum > maxPageNum) {
        obj.pageNum = maxPageNum;
      } else {
        obj.pageNum = pageNum;
      }
      this.formSearch = obj;
      this.getList(obj);
    },

    goBack() {
      this.type = "list";
    },

    handleAdd() {
      this.type = "add";
    },

    edit(index) {
      this.type = "edit";
      this.currentData = this.data[index];
    },

    delete() {},

    handleBillMaterials(index) {
      this.type = "billMaterials";
      this.currentData = this.data[index];
      if (this.currentData.ivtType == "入库") {
        this.inOutType = "0";
        this.generateTypeArr = _.clone(this.generateInTypeArr);
      } else {
        this.inOutType = "1";
        this.generateTypeArr = _.clone(this.generateOutTypeArr);
      }
      this.$refs.child.orderDetails(this.currentData.orderNum);
    }
  }
};
</script>
<style lang="less" >
@import "./yy-whp-parameter-record.less";
</style>
